import { App, reactive, ref } from "vue";
import { createI18n } from "vue-i18n";
import defaultLang from "./lang/zh-cn";
import zhcn from "element-plus/lib/locale/lang/zh-cn";
import en from "element-plus/lib/locale/lang/en";

let currentGlobalLang = "zh-cn"; //默认中文,当前语言
/**
 * langList 语言列表
 * @params key 表示语言包文件名，key值和element-plus 的国际化语言包名保持一致
 * https://element-plus.gitee.io/zh-CN/guide/i18n.html#cdn-%E7%94%A8%E6%B3%95
 * @params appro表示语言包近似名 例如
 * 在系统中获取的语言中国大陆表示'zh-CN',台湾表示'zh-tw',那就用zh近似值表示含有这个字段的统一都加载简体中文
 * 后面要区分可以自行细分，同理英语也是这样
 */
const langList: Array<object> = [
  { key: "zh-cn", appro: "zh" },
  { key: "en", appro: "en" },
];

//所有的element-plus 语言包
const elementPlusLangList: any = {
  "zh-cn": zhcn,
  en: en,
};
//获取的系统语言
const systemLang: string = window.navigator.language;
const i18n: any = createI18n({
  locale: currentGlobalLang, //默认中文
  messages: {
    "zh-cn": defaultLang, //默认中文语言包
  },
});

/**
 * 加载所有语言包
 */
async function addLangPacks() {
  langList.forEach(async (item: any) => {
    const currentLang = await import(`./lang/${item.key}.ts`);
    i18n.global.messages[item.key] = currentLang.default || {};
  });
}

/**
 * 设置系统语言
 */
function setSystemLang() {
  if (systemLang) {
    langList.forEach((item: any) => {
      if (systemLang.includes(item.appro)) {
        i18n.global.locale = item.key;
        setElementPlusLang(item);
      }
    });
  }
}

/**
 * 加载element-plus当前语言包并设置为当前语言
 * @param item
 */
let elementPlusLocale = reactive({
  lang: null,
});
async function setElementPlusLang(item: any) {
  elementPlusLocale.lang = elementPlusLangList[item.key];
}

/**
 * 切换语言
 * @param
 */
function changeGlobalLang(currentLang: string) {
  if (currentLang) {
    langList.forEach((item: any) => {
      if (currentLang.includes(item.appro)) {
        i18n.global.locale = item.key;
        setElementPlusLang(item);
        currentGlobalLang = item.key;
      }
    });
  }
}

//使用i18n包
function localeLang(app: App) {
  app.use(i18n);
  addLangPacks();
  setSystemLang();
}

export {
  i18n, //i18n实例
  langList, //本地语言包数组
  systemLang, //系统语言
  setElementPlusLang, //设置element-plus语言
  elementPlusLocale, //element-plus语言,响应式的
  changeGlobalLang, //修改语言
  currentGlobalLang, //当前环境使用的语言，
};

export default localeLang;
